<template>
	<view>
		<cu-custom :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">{{isAlwaysMode?'我常用的':'我用过的'}}</block>
		</cu-custom>
		<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :up="upOption">
		<view v-for="(item,index) in dataList" :key="index">
			<view class="cu-card article">
				<view @tap="jumpToMiniProgram(item.mini_program)" class="cu-item">
					<view class="flex justify-start align-top padding-left padding-top padding-right" style="width: 100%;">
						<view style="width: 120upx;height: 120upx;">
							<image mode="aspectFill" :src="item.mini_program.icon" class="radius" style="width: 120upx;height: 120upx;"></image>
						</view>
						<view class="flex justify-between align-center" style="width: 100%;">
							<view class="flex justify-between align-start padding-left-sm" style="flex-direction: column;height: 100%;width: 100%;">
								<text class="text-bold text-black text-lg">{{item.mini_program.short_name}}</text>
								<view class="flex align-center justify-start">
									<view class="flex align-center justify-start">
										<text class="text-gray text-sm">上次使用:</text>
										<text class="text-grey text-sm">{{item.show_time}}</text>
									</view>
									<view class="flex align-center justify-start padding-left">
										<text class="text-gray text-sm">打开次数:</text>
										<text class="text-grey text-sm">{{item.count}}</text>
									</view>
								</view>
							</view>
							<view v-if="item.is_outside==0" >
								<button @click.stop="setOutsideAction(item,index)" class="cu-btn bg-cyan radius sm" style="min-width: 120upx;">设置外显</button>
							</view>
							<view v-else>
								<button @click.stop="unbindOutsideAction(item,index)" class="cu-btn bg-red radius sm" style="min-width: 120upx;">取消外显</button>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		</mescroll-body>
	</view>
</template>

<script>
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	import {
		getAlwaysUsedMiniProgramList,
		getUsedMiniProgramList,
		markMiniProgramOutside,
		unbindMiniProgramOutside,
		markMiniProgramUsed
	} from '@/api/api.js';
	import {
		getTimeDistance
	} from '@/api/utils.js'
	import {
		isMiniProgramOutsideTipReadStatusOk,
		saveMiniProgramOutsideTipReadStatus
	} from '@/api/statusCache.js'
	import config from '@/api/config.js'
	export default {
		mixins: [MescrollMixin],
		data() {
			return {
				isAlwaysMode:false,
				dataList: [],
				upOption: {
					page: {
						size: 10 // 每页数据的数量,默认10
					},
					textNoMore: config.customNoMore,
					noMoreSize: 1, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
					empty: {
						tip: '暂无相关数据'
					}
				},
			}
		},
		onLoad(options) {
			if(options.isAlways !== null && options.isAlways !== undefined && options.isAlways !== "") 
			{
				this.isAlwaysMode = true
			}
		},
		methods: {
			jumpToMiniProgram(item)
			{
				uni.navigateToMiniProgram({
				  appId: item.app_id,
				  path: item.index_path,
				  success(res) {
				    // 打开成功
					console.log('open mini success!');
				  }
				})
				markMiniProgramUsed(item.program_id).then(res=>{
					console.log('标记小程序使用记录成功:'+item.program_id);
				}).catch(error=>{
					console.log('标记小程序使用记录失败:'+item.program_id);
				})
			},
			setOutsideAction(item,index) 
			{
				let isTipRead = isMiniProgramOutsideTipReadStatusOk()
				if(!isTipRead) {
					let that = this
					uni.showModal({
						title:'设置提示',
						content:'设置小程序外显后，可以在《我的》页面看到，最多设置三个!',
						confirmText:'立即设置',
						success(res) {
							if(res.confirm) {
								uni.showLoading({
									title:'正在设置...'
								})
								markMiniProgramOutside(item.program_id).then(res=>{
									uni.hideLoading()
									uni.showToast({
										title:'设置成功'
									})
									that.dataList[index].is_outside = 1
									uni.$emit('UserInfoNeedUpdate')
								}).catch(error=>{
									uni.hideLoading()
									uni.showToast({
										icon:'none',
										title:'设置失败'
									})
								})
							}
						}
					})
					saveMiniProgramOutsideTipReadStatus()
					return
				}
				uni.showLoading({
					title:'正在设置...'
				})
				markMiniProgramOutside(item.program_id).then(res=>{
					uni.hideLoading()
					uni.showToast({
						title:'设置成功'
					})
					this.dataList[index].is_outside = 1
					uni.$emit('UserInfoNeedUpdate')
				}).catch(error=>{
					uni.hideLoading()
					uni.showToast({
						icon:'none',
						title:'设置失败'
					})
				})	
			},
			unbindOutsideAction(item,index) 
			{
				uni.showLoading({
					title:'正在解除...'
				})
				unbindMiniProgramOutside(item.program_id).then(res=>{
					uni.hideLoading()
					uni.showToast({
						title:'解除成功'
					})
					this.dataList[index].is_outside = 0
					uni.$emit('UserInfoNeedUpdate')
				}).catch(error=>{
					uni.hideLoading()
					uni.showToast({
						icon:'none',
						title:'解除失败'
					})
				})	
			},
			jumpToDetail(post,reportId) 
			{
				uni.navigateTo({
					url:'/pages/admin/audit-post-detail/audit-post-detail?postId='+post.post_id+'&reportId='+reportId
				})
			},
			getDataList(pageIndex, pageSize) {
				if(this.isAlwaysMode) {
					getAlwaysUsedMiniProgramList(pageIndex, pageSize).then(res=>{
						res.data.list.forEach(item=>{
							if(item.updated_at !== null) {
								item.show_time = getTimeDistance(item.updated_at)
							}else{
								item.show_time = getTimeDistance(item.created_at)
							}
						})
						let pageList = res.data.list
						if(pageIndex == 0){
							this.dataList = res.data.list
						}else{
							this.dataList = this.dataList.concat(res.data.list)
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
					}).catch(error=>{
						if(this.mescroll) {
							this.mescroll.endErr()
						}
					})
				}else{
					getUsedMiniProgramList(pageIndex, pageSize).then(res=>{
						res.data.list.forEach(item=>{
							if(item.updated_at !== null) {
								item.show_time = getTimeDistance(item.updated_at)
							}else{
								item.show_time = getTimeDistance(item.created_at)
							}
						})
						let pageList = res.data.list
						if(pageIndex == 0){
							this.dataList = res.data.list
						}else{
							this.dataList = this.dataList.concat(res.data.list)
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
					}).catch(error=>{
						if(this.mescroll) {
							this.mescroll.endErr()
						}
					})
				}
			},
			downCallback() {
				if (this.mescroll) {
					this.mescroll.resetUpScroll()
				}
			},
			upCallback(page) {
				let pageIndex = page.num - 1
				this.getDataList(pageIndex, page.size)
			},
		},
	}
</script>

<style scoped>

</style>